<template>
  <view>
    <tuiTabbar :current="current" backdropFilter hump backgroundColor="#FFFFFF" :tabBar="tabBarList" color="#666666"
      :isFixed="isFixed" selectedColor="#138E57" @click="tabbarSwitch"></tuiTabbar>
    <view class="zhan-fixed" v-if="isFixed"></view>
  </view>
</template>

<script>
import tuiTabbar from "./tui-tabbar.vue";
export default {
  components: {
    tuiTabbar,
  },
  data() {
    return {
      current: 0,
      tabBarList: [
        {
          pagePath: "/pages/index/index",
          text: "首页",
          iconPath: "/static/images/tabbar/index.png",
          selectedIconPath: "/static/images/tabbar/index_active.png",
          permission: ['*:*:*']
        },
        {
          pagePath: "/pages/warehousing/index",
          text: "入库管理",
          iconPath: "/static/images/tabbar/warehousing.png",
          selectedIconPath: "/static/images/tabbar/warehousing_active.png",
          permission: ['system:warehousing:page']
        },
        {
          pagePath: "/pages/order/index",
          text: "订单管理",
          iconPath: "/static/images/tabbar/icon3_inactive.png",
          selectedIconPath: "/static/images/tabbar/icon3_active.png",
          permission: ['system:order:page']
        },
        {
          pagePath: "/pages/alarm/index",
          text: "报警管理",
          iconPath: "/static/images/tabbar/icon4_inactive.png",
          selectedIconPath: "/static/images/tabbar/icon4_active.png",
          permission: ['system:alarm:page']
        },
      ],
    };
  },
  props: {
    tabIndex: {
      type: Number,
      default: 0,
    },
    isFixed: {
      type: Boolean,
      default: !0,
    },
  },
  watch: {
    tabIndex: {
      handler(val) {
        this.current = val;
      },
      immediate: true,
    },
  },
  created() { },
  methods: {
    tabbarSwitch(e) {
      uni.switchTab({
        url: e.pagePath,
      });
    },
  },
};
</script>

<style scoped lang="scss">
.zhan-fixed {
  height: 100rpx;
  height: calc(100rpx + constant(safe-area-inset-bottom));
  height: calc(100rpx + env(safe-area-inset-bottom));
}
</style>
